A Bar chart showing the onmodaldialog event

This bar chart uses the ModalDialog which in turn uses the onmodaldialog event which is added using DOM1 style methods. Click on the canvas and a ModalDialog will be shown that uses the DOM1 style onmodaldialog event to show an alert().

[No canvas support]

This goes in the documents header:
<script src="RGraph.common.core.js"></script>
<script src="RGraph.common.dynamic.js"></script>
<script src="RGraph.modaldialog.js"></script>
<script src="RGraph.bar.js"></script>
Put this where you want the chart to show up:
<canvas id="cvs" width="600" height="250">
    [No canvas support]
</canvas>
This is the code that generates the chart:
<script>
    window.onload = function ()
    {
        var bar = new RGraph.Bar({
            id: 'cvs',
            data: [4,8,5,3,4,6,8],
            options: {
                labels: ['Mon','Tue','Wed','Thu','Fri','Sat','Sun'],
                shadowOffsetx: 2,
                shadowOffsety: 2,
                shadowBlur: 2,
                'background.grid.autofit.numvlines': 7,
                textSize:16,
                textAccessible: true
            }
        }).draw();
        
        bar.onclick = function (e, shape)
        {
            ModalDialog.Show('string:<h1>A sample dialog</h1><center><a href="javascript:ModalDialog.Close()">Close</a></center>');
        }
    
        bar.onmousemove = function (e, shape)
        {
            return true;
        }
        
        ModalDialog.onmodaldialog = function (obj)
        {
            console.log('In the onmodaldialog DOM1 style event listener');
        }
    };
</script>